{% include 'header.html' %}
<div class="layui-fluid">
    <div class="layui-row layui-col-space15">
        <div class="layui-col-md12">
            <div class="layui-card">
                <div class="layui-card-header">简单用法</div>
                <div class="layui-form-item">
                    <label class="layui-form-label" style="width: 120px;">通知用户</label>
                    <div class="layui-input-inline" style="margin-left: 20px; width: 450px;">
                        <input id="select_users" type="text" name="noticUser" autocomplete="on" placeholder="请点击下面搜索图标进行选择"
                               class="layui-input">
                        <i class="layui-icon iconSerch">点击选择</i>
                    </div>
                </div>
                <div id="showChooseDiv" class="showChooseDiv" style="display: none;  padding: 20px">
                    <div id="dept_main" style="margin-right: 2%;">
                        <div id="dept_tree"></div>
                        <div class="layui-form-item float-right">
                            <div class="layui-input-block">
                                <button class="layui-btn layui-btn-normal layui-btn-sm" id="lay-submit-Choose">关闭
                                </button>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<script>
function get_class() { //获取节点数据
    var treeData = [];
    layui.$.ajax({
        url: '/servers/get_class', //接口
        type: 'get', //请求方式
        async: false, //同步请求
        success: function(result) {
            treeData = result.data;
        }
    });
    console.log('节点数据：', treeData);
    return treeData;
}
var files;
var form;
var layer;
var $;
var transfer;
layui.use(['layer', 'tree'], function() {
    var $ = layui.jquery;
    layer = layui.layer;
    var tree = layui.tree;
    //树形组件复选框
    var data = get_class();
    tree.render({
        elem: '#dept_tree',
        data: data,
        edit: [],
        showCheckbox: false,
        showRadio: true,
        id: 'treeId',
        onlyIconControl: true,
        isJump: true,
        click: function(obj) {
            var data = obj.data; //获取当前点击的节点数据
            $("[name='noticUser']").val(data.title);
            $("#lay-submit-Choose").click();
        },
    });

    //打开选择页
    $("body").on("click", ".iconSerch", function() {
        var dataInto = $(this).prev().attr("name");
        $("#lay-submit-Choose").attr("data-into", dataInto);
        var dataDicType = "";
        if (dataInto.lastIndexOf('.') == -1) {
            dataDicType = dataInto;
        } else {
            dataDicType = dataInto.substr(dataInto.lastIndexOf('.') + 1)
        }

        layer.open({
            type: 1,
            title: "选择",
            area: ['18%', '50%'],
            content: $(".showChooseDiv"),
            maxmin: false,
            shadeClose: true,
            shade: false,
        });
    });
    //选择页确定
    $("#lay-submit-Choose").on("click", function() {
        layer.close(layer.index);
        return false;
    });
    //渲染字典项选择
    function renderChoose(dataDicType) {
        layer.alert("请选择一项");
    };
});
</script>
{% include 'footer.html' %}